import type { NsNodeCollapsePanel } from '@antv/xflow'
// import React from 'react'
import { XFlowConstants } from '@antv/xflow'
import * as commandUtils from './comannd-utils'
// 2

export const DND_RENDER_ID = 'DND_RENDER_ID'

export const onNodeDrop: NsNodeCollapsePanel.IOnNodeDrop = async (nodeConfig, commandService) => {
  commandUtils.addNode(commandService, nodeConfig)
}

export const nodeDataService: NsNodeCollapsePanel.INodeDataService = async (meta, modelService) => {
  // console.log(meta, modelService)
  return [
    {
      id: '模型训练',
      header: '模型训练',
      children: [
        {
          id: '10',
          label: 'node1',
          parentId: '9',
          renderKey: "NODE1",
          ports: {
            groups: {
              // 输入链接桩群组定义
              left: {
                position: 'left',
                attrs: {
                  circle: {
                    r: 6,
                    magnet: true,
                    stroke: '#31d0c6',
                    strokeWidth: 2,
                    fill: '#fff',
                  },
                },
              },
              // 输出链接桩群组定义
              right: {
                position: 'right',
                attrs: {
                  circle: {
                    r: 6,
                    magnet: true,
                    stroke: '#31d0c6',
                    strokeWidth: 2,
                    fill: '#fff',
                  },
                },
              },
              top: {
                position: 'top',
                attrs: {
                  circle: {
                    r: 6,
                    magnet: true,
                    stroke: '#31d0c6',
                    strokeWidth: 2,
                    fill: '#fff',
                  },
                },
              },
              bottom: {
                position: 'bottom',
                attrs: {
                  circle: {
                    r: 6,
                    magnet: true,
                    stroke: '#31d0c6',
                    strokeWidth: 2,
                    fill: '#fff',
                  },
                },
              },
            },
            items: [
              {
                id: 'port1',
                group: 'top',
              },
              {
                id: 'port2',
                group: 'right',
              },
              // {
              //   id: 'port3',
              //   group: 'in',
              // },
              {
                id: 'port4',
                group: 'bottom',
              },
              {
                id: 'port5',
                group: 'left',
              },
            ],
          }
          // isDisabled: true,
        },
        {
          id: '11',
          label: 'node2',
          parentId: '9',
          renderKey: "NODE2",
          ports: {
            groups: {
              // 输入链接桩群组定义
              left: {
                position: 'left',
                attrs: {
                  circle: {
                    r: 6,
                    magnet: true,
                    stroke: '#31d0c6',
                    strokeWidth: 2,
                    fill: '#fff',
                  },
                },
              },
              // 输出链接桩群组定义
              right: {
                position: 'right',
                attrs: {
                  circle: {
                    r: 6,
                    magnet: true,
                    stroke: '#31d0c6',
                    strokeWidth: 2,
                    fill: '#fff',
                  },
                },
              },
              top: {
                position: 'top',
                attrs: {
                  circle: {
                    r: 6,
                    magnet: true,
                    stroke: '#31d0c6',
                    strokeWidth: 2,
                    fill: '#fff',
                  },
                },
              },
              bottom: {
                position: 'bottom',
                attrs: {
                  circle: {
                    r: 6,
                    magnet: true,
                    stroke: '#31d0c6',
                    strokeWidth: 2,
                    fill: '#fff',
                  },
                },
              },
            },
            items: [
              {
                id: 'port1',
                group: 'top',
              },
              {
                id: 'port2',
                group: 'right',
              },
              // {
              //   id: 'port3',
              //   group: 'in',
              // },
              {
                id: 'port4',
                group: 'bottom',
              },
              {
                id: 'port5',
                group: 'left',
              },
            ],
          }
        },
        {
          id: '12',
          label: 'node3',
          parentId: '9',
          renderKey: XFlowConstants.XFLOW_DEFAULT_NODE,
          ports: {
            groups: {
              // 输入链接桩群组定义
              left: {
                position: 'left',
                attrs: {
                  circle: {
                    r: 6,
                    magnet: true,
                    stroke: '#31d0c6',
                    strokeWidth: 2,
                    fill: '#fff',
                  },
                },
              },
              // 输出链接桩群组定义
              right: {
                position: 'right',
                attrs: {
                  circle: {
                    r: 6,
                    magnet: true,
                    stroke: '#31d0c6',
                    strokeWidth: 2,
                    fill: '#fff',
                  },
                },
              },
              top: {
                position: 'top',
                attrs: {
                  circle: {
                    r: 6,
                    magnet: true,
                    stroke: '#31d0c6',
                    strokeWidth: 2,
                    fill: '#fff',
                  },
                },
              },
              bottom: {
                position: 'bottom',
                attrs: {
                  circle: {
                    r: 6,
                    magnet: true,
                    stroke: '#31d0c6',
                    strokeWidth: 2,
                    fill: '#fff',
                  },
                },
              },
            },
            items: [
              {
                id: 'port1',
                group: 'top',
              },
              {
                id: 'port2',
                group: 'right',
              },
              // {
              //   id: 'port3',
              //   group: 'in',
              // },
              {
                id: 'port4',
                group: 'bottom',
              },
              {
                id: 'port5',
                group: 'left',
              },
            ],
          }
        },
      ],
    },
  ]
}